<script lang="ts">
	import { createEventForwarder, useActions } from '$lib/internal';
	import { get_current_component } from 'svelte/internal';
	import { ActionIcon } from '../ActionIcon';
	import type { ActionIconProps } from '../ActionIcon';

	interface $$Props extends Omit<ActionIconProps, 'className' | 'use'> {
		size?: number;
		className?: string;
		role?: string;
		title?: string;
	}

	export let element: $$Props['element'] = undefined;
	export let size: $$Props['size'] = 15;
	export let className: string = '';
	export { className as class };

	const forwardEvents = createEventForwarder(get_current_component());
</script>

<ActionIcon
	bind:element
	use={[forwardEvents, [useActions, $$restProps?.use]]}
	class={className}
	{...$$restProps}
>
	<svg
		width={size}
		height={size}
		viewBox="0 0 15 15"
		fill="none"
		xmlns="http://www.w3.org/2000/svg"
	>
		<path
			d="M3.625 7.5C3.625 8.12132 3.12132 8.625 2.5 8.625C1.87868 8.625 1.375 8.12132 1.375 7.5C1.375 6.87868 1.87868 6.375 2.5 6.375C3.12132 6.375 3.625 6.87868 3.625 7.5ZM8.625 7.5C8.625 8.12132 8.12132 8.625 7.5 8.625C6.87868 8.625 6.375 8.12132 6.375 7.5C6.375 6.87868 6.87868 6.375 7.5 6.375C8.12132 6.375 8.625 6.87868 8.625 7.5ZM12.5 8.625C13.1213 8.625 13.625 8.12132 13.625 7.5C13.625 6.87868 13.1213 6.375 12.5 6.375C11.8787 6.375 11.375 6.87868 11.375 7.5C11.375 8.12132 11.8787 8.625 12.5 8.625Z"
			fill="currentColor"
			fill-rule="evenodd"
			clip-rule="evenodd"
		/>
	</svg>
</ActionIcon>
